<template>
  <div class="empty-container" :style="{ minHeight: minHeight }">
    <div class="tracking-pool" v-if="isTrackingPool">
      <div class="bg"></div>
      <atom-button type="primary" block @click.stop="$emit('goCustomize')">去定制</atom-button>
    </div>
    <atom-empty :title="desc" imageSize="32vw" v-else></atom-empty>
  </div>
</template>

<script>
export default {
  props: {
    // 是否为跟踪池
    isTrackingPool: {
      type: Boolean,
      default: false,
    },
    minHeight: {
      type: String,
      default: '80vw',
    },
    desc: {
      type: String,
      default: '暂无符合个股推荐，请关注下期更新',
    },
  },
};
</script>

<style lang="less">
.atom-empty__title {
  color: var(--text-3) !important;
}

.empty-container {
  padding: 16px 0;
  display: flex;
  .bg {
    height: 256px;
    width: 343px;
    background: url('../../assets/images/empty-trackpool_light.png');
    background-position: center;
    background-size: cover;
    margin-bottom: 16px;
  }
  [theme-mode='black'] .bg {
    background: url('../../assets/images/empty-trackpool_dark.png');
  }
}
</style>
>
